<template>
  <div>
    <div class="top-header">
      <div class="left-menu">
        <el-menu
          default-active="线上舆情数据"
          class="org-el-menu"
          background-color="#0F1920"
          text-color="#869FB1"
          @open="open"
          @close="close"
          active-text-color="#ffffff">
          <div v-for="(item,index) in menus" :key="index">
            <el-submenu :index="index+'a'" v-if="item.children">
              <template slot="title">
                <img :src="icon" alt="">
                <span>{{item.name}}</span>
              </template>
              <el-menu-item-group>
                <el-menu-item :index="i.name" v-for="(i,idx) in item.children" :key="idx" @click="toUrl(i.link)">{{i.name}}</el-menu-item>
              </el-menu-item-group>
            </el-submenu>
            <el-menu-item :index="index+'c'" v-else @click="toUrl(item.link)">
              <img :src="item.icon" alt="">
              <span slot="title">{{item.name}}</span>
            </el-menu-item>
          </div>
        </el-menu>
      </div>
      <div class="right-content">
        <router-view/>
      </div>
    </div>
  </div>
</template>
<script>
  export default {
    data () {
      return {
        icon: require('../assets/data-active.png'),
        activeIcon: require('../assets/data-active.png'),
        inactiveIcon: require('../assets/data.png'),
        menus:[
          {
            name:"数据采集",
            link:'menu',
            showContent:false,
            children:[
              {name:"线上舆情数据", link:'/full/menu/DAQOnlinePublicOpinion'},
              {name:"线上销售数据", link:'/full/menu/DAQOnlineSale'},
              {name:"售后数据", link:'/full/menu/DAQAfterSale'},
              {name:"线下销售数据", link:'/full/menu/DAQOfflineSale'},
              {name:"市场调研", link:'/full/menu/DAQMarketResearch'},
              {name:"用户访谈", link:'/full/menu/DAQUserInterview'},
              {name:"导购反馈", link:'/full/menu/DAQFeedback'}
            ]

          },
        ]
      }
    },
    methods: {
      open() {
        this.icon = this.activeIcon
      },
      close() {
        console.log('close')
        this.icon = this.inactiveIcon
      },
      toUrl(url){
        this.$router.push({path: url});
      }
    },
  }
</script>

